import { UserOutlined } from "@ant-design/icons";
import { Avatar } from "antd";
import React from "react";

export interface UserAvatarProps {
  userInfo: API.User;
  size?: number;
  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;
  className?: string;
}

const UserAvatar: React.FC<UserAvatarProps> = ({
  userInfo,
  size,
  onClick,
  className,
}) => {
  return (
    <Avatar
      size={size}
      onClick={onClick}
      icon={<UserOutlined />}
      src={userInfo.avatarFile?.href}
      className={`cursor-pointer ${className}`}
    />
  );
};

export default UserAvatar;
